<form nz-form [formGroup]="validateForm">
  <div nz-row [nzGutter]="8" style="margin-top: 12px;">
    <div nz-col [nzSpan]="24">
      <nz-card>
        <ng-template #title>
          <span style="float: left">章节内容</span>
          <div style="float: left;margin-left: 24px;">
              <label>小节数:</label>
              <nz-input-number formControlName="jie" [nzSize]="'large'" [nzMin]="1" [nzMax]="20" [nzStep]="1"></nz-input-number>
              <a [nzSize]="'large'" style="width: 88px;line-height: 28px;margin-top: 6px;" nz-button [nzType]="'success'" (click)="setchild()">
                <span>确定</span>
              </a>
          </div>
          <a [nzSize]="'large'" style="width: 88px;float: right;line-height: 28px;margin-top: 6px;" nz-button [nzType]="'danger'" (click)="removi(index.item)">
            <span>删除</span>
          </a>
          <a [nzSize]="'large'" style="width: 88px;float: right;margin-right:14px;line-height: 28px;margin-top: 6px;" nz-button [nzType]="'default'" (click)="addnew()">
            <span>新增小节</span>
          </a>

        </ng-template>
        <ng-template #body>
          <div nz-col [nzSpan]="12">
            <div nz-form-item nz-row>
              <div nz-form-label nz-col [nzSpan]="4">
                <label nz-form-item-required>章节名</label>
              </div>
              <div nz-col [nzSpan]="12" nz-form-control [nzValidateStatus]="getFormControl('sectionname')" nzHasFeedback>
                <nz-input formControlName="sectionname" (nzBlur)="changes()" [nzType]="'text'" [nzPlaceHolder]="'请输入章节名'" [nzSize]="'large'" >
                </nz-input>
                <div nz-form-explain *ngIf="getFormControl('sectionname').dirty&&getFormControl('sectionname').hasError('required')">请输入章节名!</div>
              </div>
            </div>
          </div>
          <div nz-col [nzSpan]="12">
            <div nz-form-item nz-row>
              <div nz-form-label nz-col [nzSpan]="4">
                <label nz-form-item-required>章节顺序</label>
              </div>
              <div nz-col [nzSpan]="12" nz-form-control [nzValidateStatus]="getFormControl('sectionsort')" nzHasFeedback>
                <nz-select
                  formControlName="sectionsort"
                  (nzOpenChange)="changes()"
                  nzAllowClear
                  [nzSize]="'large'"
                  [nzPlaceHolder]="'choose'">
                  <nz-option
                    *ngFor="let item of options"
                    [nzLabel]="item.label"
                    [nzValue]="item.value">
                  </nz-option>
                </nz-select>

                <div nz-form-explain *ngIf="getFormControl('sectionsort').dirty&&getFormControl('sectionsort').hasError('required')">请输入章节名!</div>
              </div>
            </div>
          </div>
          <chapters-com *ngFor="let key of repeat"  [index]="key" (test)="getChild($event)"></chapters-com>

        </ng-template>
      </nz-card>
    </div>
  </div>
</form>


